<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script>
	$(function(){
		$.ajax({
			type:"post",
			url:"${initParam.root}messenger/auth_checkbox.do",
			data:"checked=&unchecked=",
			success:function(jsonData){
				var receiversTemp="";
				$.each(jsonData,function(index,value){
					receiversTemp+=value+",";
					$.each($(":input[name=friend]"),function(index2,value2){
						if($(value2).val()==value){
							$(value2).prop("checked",true);
						}
					});
				});
			}
		}); // ajax
		
		$(":checkbox[name=allCheck]").change(function(){
			var allFlag=$(this).prop("checked");
			/* $(":checkbox[name=menu]").each(function(){
				var menuFlag=$(this).prop("checked");
				if(allFlag!=menuFlag){
					$(this).prop("checked",allFlag);
				}
			}); */
			// 다음과 같이 처리하도록 jquery 에서 지원
			$(":checkbox[name=friend]").prop("checked",allFlag);
			$(":input[name=friend]").change();
		}); // change
		$(":input[name=friend]").change(function(){
			var checkedTemp="";
			var uncheckedTemp="";
			$.each($(":input[name=friend]"),function(index,value){
				if($(value).prop("checked")==true){
					checkedTemp+=$(value).val()+",";
				}else{
					uncheckedTemp+=$(value).val()+",";
				}
			});
			var checked=checkedTemp.substring(0,checkedTemp.length-1);
			var unchecked=uncheckedTemp.substring(0,uncheckedTemp.length-1);
			
			$.ajax({
				type:"post",
				url:"${initParam.root}messenger/auth_checkbox.do",
				data:"checked="+checked+"&unchecked="+unchecked,
				success:function(jsonData){
					var receiversTemp="";
					$.each(jsonData,function(index,value){
						//alert(value);
						receiversTemp+=value+",";
						$.each($(":input[name=friend]"),function(index2,value2){
							if(($(value2).val()==value)){
								$(value2).prop("checked",true);
							}
						});
					});
				}
			}); // ajax
		}); // check change
		
		$("#friendDeleteBtn").click(function(){
			//alert(($(":checkbox[name=friend]:checked")[0]).value );
			var checkedFriends=$(":checkbox[name=friend]:checked");
			if(checkedFriends.length==0){
				return;
			}
			/* $.each(checkedFriend,function(index,value){
				//alert($(value).val());
				//location.href="${initParam.root}messenger/deleteFriend.do?test="+checkedFriend;
			}); */
			//alert($(checkedFriends).serialize());
			var deleteFriends="";
			$.each(checkedFriends, function(index,value){
				deleteFriends+=$(value).val()+" ";
			});
			//alert(deleteFriends);
			if(confirm(deleteFriends+" 친구를 삭제하겠습니까?")){
				$("#friendListForm").submit();
			}
		}); // $("#friendDeleteBtn").click(function(){
		$("#sendMessageBtn").click(function(){
		    window.open("${initParam.root}messenger/auth_messengerPopup.do?tab=0", "popup", "width=750, height=500, location=no, toolbar=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no" );
		});
	});
</script>
<center>
<b>친구목록</b><br>
<p>
	<c:set var="pb" value="${requestScope.map.lvo.pagingBean}"></c:set>
	<c:if test="${pb.previousPageGroup}">
		<a href="${initParam.root }messenger/auth_friendList.do?friendListPage=${pb.startPageOfPageGroup-1}">◀</a>	
	</c:if>
	<c:forEach var="i" begin="${pb.startPageOfPageGroup}" end="${pb.endPageOfPageGroup}">
		<c:if test="${i!=0 }">
			<c:choose>
				<c:when test="${pb.nowPage!=i}">
					<a href="${initParam.root }messenger/auth_friendList.do?friendListPage=${i}">${i}</a> 
				</c:when>
				<c:otherwise>
					<font style="color: red; font-size: 10.5pt;">${i}</font>
				</c:otherwise>
			</c:choose>
		</c:if>
	</c:forEach>	 
	<c:if test="${pb.nextPageGroup}">
		<a href="${initParam.root }messenger/auth_friendList.do?friendListPage=${pb.endPageOfPageGroup+1}">▶</a>
	</c:if>
</p>
<form id="friendListForm" method="post" action="${initParam.root}messenger/auth_deleteFriend.do">
	<table>
		<thead>
			<tr>
				<th><input type="checkbox" name="allCheck"></th>
				<th>ID</th>
				<th>NAME</th>
				<th>ADDRESS</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${requestScope.map.lvo.list}" var="list">
					<tr>
						<td><input type="checkbox" name="friend" value="${list.id }"></td>
						<td>${list.id }</td>
						<td>${list.name }</td>
						<td>${list.address }</td>
					</tr>
			</c:forEach>
		</tbody>
		<tfoot>
			<tr>
				<c:choose>
					<c:when test="${requestScope.map.flag=='noFriend' }">
						<td colspan="4" align="right">친구가 없습니다.</td>
					</c:when>
					<c:otherwise>
						<td colspan="4" align="center"><input type="button" value="쪽지보내기" id="sendMessageBtn"> <input type="button" value="친구삭제" id="friendDeleteBtn"></td>
					</c:otherwise>
				</c:choose>
			</tr>
		</tfoot>
	</table>
</form>
</center>